<template>
	<!-- 钻石组件 -->
	<view class="diamondNum">
		<view class="test" @click="diamondNumFn">
			<image src="@/static/image/index/zuanshi.png" class="icon"></image>
			(0)
		</view>
		<u-popup :show="popup.show" @close="closePopup" mode="center" closeable>
			<view class="modalcenter">
				<div class="i1"><image src="@/static/image/index/ad.png" class="icon"></image></div>
				<div class="i2">Watch video ads and<text class="blod">get <text class="red">3</text></text> Diamonds</div>
				<div class="btn" @click="showAd"> Watch </div>
			</view>
		</u-popup>
	</view>
</template>

<script>
	// #ifdef APP
	let jygooglead = uni.requireNativePlugin("JY-GoogleAdMob");
	// #endif
	export default {
		name:"diamondNum",
		data() {
			return {
				popup:{
					show:false
				}
			};
		},
		mounted() {
			jygooglead.jy_init();
			this.loading_Ad_Video()
		},
		methods:{
			diamondNumFn(){
				this.popup.show=true
			},
			//关闭弹框
			closePopup(){
				this.popup.show=false
			},
			//加载激励广告
			loading_Ad_Video(){
				// #ifdef APP
				//加载激励广告
				jygooglead.jy_loadRewardedAd({
					adId: getApp().globalData.insertVideoAd,
					appId: 'ca-app-pub-7130333932129753~9197186401'
				}, res=> {
					console.log(res);
				});
				// #endif
			},
			//显示激励视频
			showAd(){
				console.log('显示激励视频');
				// #ifdef APP
				this.loading_Ad_Video()
				jygooglead.jy_showRewardedAd({},result=> {
					console.log(JSON.stringify(result));
				})
				// #endif
			}
		}
	}
</script>

<style scoped lang="scss">
	/deep/ .u-popup__content{
		width: 70%;
	}
	.diamondNum{
		color: #fff;
		.test{
			display: flex;align-items: center;margin-left: 4px;
			.icon{
				width:22px;height: 22px;margin-right: 2px;
			}
		}
	}
	.modalcenter{
		background-color: #fff;color: #000;padding:20px 10px;border-radius: 10px;
		display: flex;justify-content: center;flex-direction: column;align-items: center;
		.i1{
			display: flex;justify-content: center;
			.icon{
				width:30px;height: 30px;
			}
		}
		.i2{
			text-align: center;color: #565656;
			.blod{
				font-weight: bold;margin-left: 5px;
			}
			.red{
				color: red;margin: 0 5px;
			}
		}
		.btn{
			padding: 5px 20px;background-color: #cbcbcb;color: #565656;margin-top: 10px;border-radius: 5px;
		}
	}

</style>